import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

// 引入进度条样式
import 'nprogress/nprogress.css'

//引入自定义滚动条
import HappyScroll from 'vue-happy-scroll'
import 'vue-happy-scroll/docs/happy-scroll.css'

//自动滚动插件
import scroll from 'vue-seamless-scroll'

// 炫酷的粒子动效
import VueParticles from 'vue-particles'

// 引入图表
import VCharts from 'v-charts'


Vue.use(VCharts)

// 制作地图
import echarts from 'echarts'

Vue.prototype.$echarts = echarts
import china from 'echarts/map/json/china.json'

echarts.registerMap('china', china)

// 炫酷图标
import dataV from '@jiaminghi/data-view'

Vue.use(dataV)

import axios from 'axios'
//import VueAxios from 'vue-axios'
import qs from "qs";
// Vue.use(VueAxios, axios);
// Vue.use(qs);
// 设置基础URL为后端服务api地址，注：这里冒号里的，是后台 Tomcat 服务器启动的端口地址
axios.defaults.baseURL = window.g.baseURL;
// axios.defaults.headers.common['Authorization'] = store.state.token; //全局设置状态里的token
axios.defaults.headers.post['Content-Type'] = 'application/json'; //全局post请求使用application/json数据格式
//设置全局，每次ajax请求携带cookies
// axios.defaults.withCredentials = true
// 将API方法绑定到全局
Vue.prototype.$http = axios;
/* 解决 axios options请求后台无法接收参数的问题 */
Vue.prototype.$qs = qs;

Vue.config.productionTip = false

Vue.use(HappyScroll)

Vue.use(scroll)

Vue.use(VueParticles)

Vue.use(ElementUI);

// 全局路由守卫
import './router/permission'

// 全局注册指令
import vPermission from './directive/permission'

Vue.directive('permission', vPermission)


//添加http请求拦截器
axios.interceptors.request.use(
    config => {
        if (store.state.token !== undefined && store.state.token.length > 0) {
            //在http请求前header头部添加token字符串，用于后端的认证
            config.headers.common['Authorization'] = store.state.token
        }
        return config;
    },
    error => {
        //对请求错误做什么
        return Promise.reject(error);
    })

//http reponse响应拦截器
axios.interceptors.response.use(
    response => {
        return response;
    },
    error => {
        if (error.response) {
            switch (error.response.status) {
                case 401:
                    sessionStorage.removeItem('token');
                    router.replace({
                        path: '/login',
                        query: {redirect: router.currentRoute.fullPath}//登录成功后跳入浏览的当前页面
                    })
            }
        }
    })

// 路由导航守卫，全局路由构造函数，判断是否登录和要跳转到页面
// to 代表到哪里去， from代表从哪儿来， next 代表放行
router.beforeEach((to, from, next) => {
    if (to.matched.some(m => m.meta.requireAuth)) { // 需要登录
        if (window.sessionStorage.token) {
            next()
        } else if (to.path !== '/login') {
            let token = window.sessionStorage.token;
            if (token === 'null' || token === '' || token === undefined) {
                next({path: '/login'})
                this.$message({
                    message: '检测到您还未登录,请登录后操作！',
                    type: 'warning'
                });
            }
        } else {
            next()
        }
    } else {   // 不需要登录
        next()
    }
})


// const originalPush = router.prototype.push
// router.prototype.push = function push(location) {
//   return originalPush.call(this, location).catch(err => err)
// }
new Vue({
    router,
    store,
    render: h => h(App)
}).$mount('#app')


